$style: #e5373b;
#order {
	background-color: #fafafa;
	.tab {
		height: 100rpx;
		background-color: #fff;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 3;
		padding: 0 50rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.item {
			height: 100rpx;
			display: inline-block;
			font-size:28rpx;
			white-space: nowrap;
			position: relative;
			text-align: center;
			line-height: 100rpx;
			transition: color 0.3s;
			&::after {
				content: '';
				display: block;
				width:40rpx;
				height:4rpx;
				border-radius:2rpx;
				position: absolute;
				bottom: 0;
				left: 50%;
				margin-left: -20rpx;
				transition: all 0.3s;
			}
			&.active {
				color: #000;
				&::after {
					background-color: #000;
				}
			}
		}
	}
	.tab-h {
		width: 100%;
		height: 100rpx;
	}
	// .list {
	// 	width: 100%;
	// 	.item {
	// 		margin-top:20rpx;
	// 		padding:32rpx 32rpx 0;
	// 		background-color: #fff;
	// 		.tops {
	// 			width: 100%;
	// 			display: flex;
	// 			justify-content: space-between;
	// 			align-items: center;
	// 			font-size:24rpx;
	// 			line-height:24rpx;
	// 			text {
	// 				color: $style;
	// 			}
	// 		}
	// 		.order-goods-item {
	// 			border-bottom: 1px solid #f0f0f0;
				
	// 			.texts {
	// 				.bot {
	// 					.price {
	// 						color: #333;
	// 						font-weight: normal;
	// 					}
	// 				}
	// 			}
	// 		}
	// 		.notice {
	// 			width: 100%;
	// 			padding: 20rpx 26rpx;
	// 			margin-top: 20rpx;
	// 			display: flex;
	// 			color: #000;
	// 			font-size:24rpx;
	// 			background-color: #fafafa;
	// 			.label {
	// 				white-space: nowrap;
	// 				color: $style;
	// 				margin-right:10rpx;
	// 			}
	// 		}
	// 		.bots {
	// 			width: 100%;
	// 			height: 112rpx;
	// 			padding: 0.2rpx 0;
	// 			display: flex;
	// 			justify-content:space-between;
	// 			align-items: center;
	// 			.more {
	// 				flex-shrink: 0;
	// 				text {
	// 					font-size:32rpx;
	// 				}
	// 			}
	// 			.fun {
	// 				display: inline-flex;
	// 				align-items: center;
	// 				justify-content: flex-end;
	// 				.text {
	// 					width:auto!important;
	// 					font-size:24rpx;
	// 					color: #666;
	// 					margin-left:16rpx;
	// 				}
	// 				.btn {
	// 					display: flex;
	// 					align-items: center;
	// 					justify-content: center;
	// 					width: 188rpx!important;
	// 					height:72rpx;
	// 					border-radius:36rpx;
	// 					font-size:28rpx;
	// 					border: 1px solid #adadad;
	// 					margin-left:16rpx!important;
	// 					&.red {
	// 						border-color: $style;
	// 						color: $style;
	// 					}
	// 				}
	// 			}
	// 		}
	// 	}
	// }
	.list {
		width: 100%;
		box-sizing: border-box;
		padding: 24rpx 30rpx;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
		.item {
			margin-top:20rpx;
			padding: 0 32rpx;
			background-color: #fff;
			border-radius: 20rpx;
			.tops {
				width: 100%;
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 80rpx;
				font-size: 24rpx;
				border-bottom: 1px solid #E6E6E6;
				text {
					color: #F65C28;
				}
			}
			.order-goods-item {
				// border-bottom: 1px solid #f0f0f0;
				padding: 30rpx 0;
				.img{
					width: 120rpx;
					height: 120rpx;
					border-radius: 20rpx;
				}
				.texts {
					flex-grow: 1;
					width: 0;
					height: 120rpx;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					.title{
						font-size: 28rpx;
						line-height: 38rpx;
						height: auto;
						margin-top: 12rpx;
					}
					.bot {
						margin-bottom: 12rpx;
						margin-top: 0;
						.num{
							font-size: 24rpx;
							color: #666666;
						}
						.price {
							font-size: 24rpx;
							color: $style;
							font-weight: bold;
							.bold {
								font-size: 32rpx;
							}
							.normal{
								font-weight: normal;
								font-size: 24rpx;
								color: #333333;
							}
						}
					}
				}
			}
			.notice {
				width: 100%;
				padding: 20rpx 26rpx;
				margin-top: 20rpx;
				display: flex;
				color: #000;
				font-size:24rpx;
				background-color: #fafafa;
				.label {
					white-space: nowrap;
					color: $style;
					margin-right:10rpx;
				}
			}
			.count{
				text-align: right;
				padding-top: 30rpx;
				padding-bottom: 30rpx;
				border-top: 1px solid #E6E6E6;
				font-size: 24rpx;
				color: #999999;
				line-height: 1;
				text{
					font-weight: bold;
					color: #DD423F;
				}
				.bold{
					font-size: 32rpx;
				}
			}
			.bots {
				width: 100%;
				padding-bottom: 30rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				.more {
					flex-shrink: 0;
					text {
						font-size:32rpx;
					}
				}
				.fun {
					display: inline-flex;
					align-items: center;
					justify-content: flex-end;
					button{
						margin-left:20rpx!important;
					}
					.text {
						width:auto!important;
						font-size:24rpx;
						color: #666;
						margin-left:16rpx;
					}
					.btn {
						display: flex;
						align-items: center;
						justify-content: center;
						width: 166rpx!important;
						height: 60rpx;
						line-height: 60rpx;
						border-radius: 10rpx;
						font-size: 24rpx;
						border: 1px solid #F65C28;
						margin-left:16rpx!important;
						&.red {
							border-color: #F65C28;
							color: #F65C28;
						}
					}
				}
			}
		}
	}
	.mask {
		display: none;
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 4;
		background-color: rgba(0, 0, 0, 0.5);
	}
	.addr-select {
		width: 100%;
		height: 740rpx;
		background-color: #fff;
		border-radius: 16rpx 16rpx 0 0;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 5;
		padding: 0 32rpx;
		transform: translateY(100%);
		transition: all 0.3s;
		.tops {
			width: 100%;
			height: 112rpx;
			border-bottom: 1px solid #f0f0f0;
			display: flex;
			justify-content: space-between;
			align-items: center;
			.add {
				color: $style;
			}
			.title {
				font-size:32rpx;
				color: #000;
			}
			.confirm {
				color: #000;
			}
		}
		.addr-list {
			width: 100%;
			height: 628rpx;
			overflow-y: auto;
			.item {
				width: 100%;
				height: 156rpx;
				border-bottom: 1px solid #f0f0f0;
				display: flex;
				justify-content: space-between;
				align-items: center;
				.left {
					width: 570rpx;
					.name {
						view {
							display: inline-block;
						}
						text {
							font-size:24rpx;
							color: #666;
							margin-left: 10rpx;
						}
					}
					.addr {
						margin-top:5rpx;
					}
				}
			}
		}
		&.open {
			transform: translateY(0);
		}
	}
}